.lg-field {
  flex: 1;
  position: relative;
}

.lg-field__control {
  width: ~'calc(100% - 20px)';
  height: 100%;
  font-size: var(--size);
  background-color: transparent;
  &::placeholder {
    color: var(--placeholder-color);
    font-size: var(--placeholder-size);
    background-color: transparent;
  }
  &:disabled {
    color: #a8a8a8;
    // fix disabled color in mobile safari
    -webkit-text-fill-color: #a8a8a8;
  }
}
.lg-field__clear {
  width: 13px;
  height: 13px;
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
}

.lg-field__underline {
  height: 1px;
  background-color: #F9F9F9;
}
